<template>
    <section class="content">
        <navbar :title="$t('dailizhongxin.huiyuanshuying')" :right_show="false" :type="2" :left_text="$t('h_title.shouye')" ref="navbar"></navbar>
        <jilvTop @fun_tian="fun_tian" @fun_date="fun_date"></jilvTop>
        <section class="jilv-cont">
            <section id="jilv-content" >
                <section class="jilv-content" style="padding:1rem 0;">
                    <article >
                        <span>存款總額</span>
                        <span>{{total_recharge}}</span>
                    </article>
					<article >
					    <span>存款筆數</span>
					    <span>{{recharge_count}}</span>
					</article>
					<article >
					    <span>提款總額</span>
					    <span>{{total_drawing}}</span>
					</article>
					<article >
					    <span>提款筆數</span>
					    <span>{{drawing_count}}</span>
					</article>
					<article >
					    <span>紅利總額</span>
					    <span>{{total_dividend}}</span>
					</article>
					<article >
					    <span>紅利筆數</span>
					    <span>{{dividend_count}}</span>
					</article>
					<article >
					    <span>盈利</span>
					    <span>{{total_recharge - total_drawing}}</span>
					</article>
					<article >
					    <span>會員輸贏</span>
					    <span>{{total_drawing - total_recharge}}</span>
					</article>
                </section>
            </section>
        </section>
    </section>
</template>

<script>
    import navbar from "@/components/navbar"
    import jilvTop from "@/components/daili-top"
    import { Pagination } from 'vant'
    export default {
        name: "baobiao_touzhu",
        components: {
            navbar,
            jilvTop,
            [Pagination.name]: Pagination
        },
        data(){
            return {
                currentPage:1, //当前页
                pageCount: 1, //总页
                tianshu: 1,
                list:[],
                day: 1,
				total_recharge:0,
				recharge_count:0,
				total_drawing:0,
				drawing_count:0,
				total_dividend:0,
				dividend_count:0,
            }
        },
        mounted() {
            this.onLoad()
        },
        methods: {
            fun_tian(int){
                this.day = int
                this.onLoad()
            },
            fun_change() {  //点击分页
                this.onLoad()
            },
			fun_date(date){
				this.$https.fetchGet('/m/member_offline_sy',{'date': date}).then(res => {
				    let data = res.data
				    this.total_recharge = data.total_recharge
					this.recharge_count = data.recharge_count
					this.total_drawing = data.total_drawing
					this.drawing_count = data.drawing_count
					this.total_dividend = data.total_dividend
					this.dividend_count = data.dividend_count
				})
			},
            onLoad() {
                this.$https.fetchGet('/m/member_offline_sy',{'page': this.currentPage, 'day': this.day}).then(res => {
                    let data = res.data
                    this.total_recharge = data.total_recharge
                    this.recharge_count = data.recharge_count
                    this.total_drawing = data.total_drawing
                    this.drawing_count = data.drawing_count
                    this.total_dividend = data.total_dividend
                    this.dividend_count = data.dividend_count
                })
            }
        }
    }
</script>

<style scoped lang="less">
    .jilv-cont{
        padding-top: 2.3rem;
        color: #fff;
        background-color: #eee;
        height: calc(100vh - 1.2rem);
        h5{
            font-size: .36rem;
            padding: .4rem;
            color: #5d5353;
            font-weight: normal;
        }
        #jilv-content{
            background-color: #fff;
            color: #636b6f;
            text-align: left;
            padding-bottom: .1rem;
            h6{
                font-weight: normal;
                padding: .2rem .5rem;
                font-size: .4rem;
                border-bottom: 1px solid #E5E5E5;
                span{
                    color: #140BF8;
                    font-size: .7rem;
                    position: relative;
                    top: .1rem;
                    margin-left: .3rem;
                }
            }
            .jilv-content{
                article{
                    font-size: .36rem;
                    display: flex;
                    align-items: center;
                    text-align: center;
                    margin-bottom: .3rem;
                    &.top{
                        line-height: .9rem;
                    }
                    span{
                        &:nth-child(1){
                            width: 50%;
                        }
                        &:nth-child(2){
                            width: 50%;
                        }
                    }
                }
            }
        }
    }
</style>
